<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="../../layui/css/layui.css">
    <style>
        #auzicon {
            text-align: center;
        }
        #checkimg {
            color: coral;
            font-weight: bold;
        }
    </style>
</head>
<body>
<h1> 审核确认界面 </h1>
<table class="layui-hide" id="checktable"  lay-size="lg" lay-filter="checktable"></table>


<script type="text/html" id="barDemo">
    {{# if(d.stage > 2){ }}
    <a class="layui-btn layui-btn-primary layui-btn-xs layui-border-red  layui-disabled" lay-event="not03">授权已经通过</a>
    {{# } }}
    {{# if(d.stage == 2){ }}
    <a class="layui-btn layui-btn-xs" lay-event="auz">授权通过</a>
    {{# } }}
    {{# if(d.stage == 1){ }}
    <a class="layui-btn layui-btn-primary layui-btn-xs layui-border-orange layui-disabled" lay-event="not01">等待书商审核</a>
    {{# } }}
    {{# if(d.stage == 0){ }}
    <a class="layui-btn layui-btn-primary layui-btn-xs layui-border-orange  layui-disabled" lay-event="not00">等待教师审核</a>
    {{# } }}
</script>

<form class="layui-form" lay-filter = "showform" style="margin: 5%; display: none" id = "window">
    <div id="auzicon" class="layui-form-item">
        <i class="layui-icon layui-icon-tips" style="font-size: 30px; color: #FF5722;"></i>
        <h1>授权许可</h1>
    </div>
    <hr class="layui-border-black">
    <div class="layui-card">
        <div class="layui-card-header">
            <i class="layui-icon layui-icon-auz" style="text-align: center;font-size: 20px; color: #009688;"></i>
            此订单需要您的授权许可
        </div>
        <div class="layui-card-body">
            <div class="layui-form-item">
                <p>书商已经审核并通过教师的教材。</p>
                <p>如果确认无误，可以设置该教材的购买时效时期。</p>
                <p id="checkimg">该信息将会推送给所有相关学生生成订单，请仔细审核后操作。</p>
            </div>
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label ">审核编号</label>
        <div class="layui-input-inline layui-disabled">
            <input id="checkid"  type="text" name="checkid" readonly class="layui-input layui-disabled">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">阶段</label>
        <div class="layui-input-inline layui-disabled">
            <select id = "stage" name="stage"  disabled="disabled" lay-filter="stage" class="layui-disabled">
                <option value="">请选择审核阶段</option>
                <option value="0">未上传或已被删除</option>
                <option value="1">教师已上传，书商未审核</option>
                <option value="2">书商已经审核，管理员未审核</option>
                <option value="3">管理员审核，开放教材预定</option>
                <option value="4">预定完毕，待发放</option>
                <option value="5">发放完毕</option>
            </select>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label ">教材名</label>
        <div class="layui-input-inline layui-disabled" >
            <input id="bookname"  type="text" name="bookname" readonly  class="layui-input layui-disabled">
        </div>

    </div>
    <div class="layui-form-item">
        <label class="layui-form-label ">教材价格</label>
        <div class="layui-input-inline layui-disabled" >
            <input placeholder="通过选择教材以确定教材价格"  id="price" readonly type="text" name="price" class="layui-input layui-disabled">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label ">教材编号</label>
        <div class="layui-input-inline layui-disabled" >
            <input id="bookid" readonly type="text" name="bookid" autocomplete="off" class="layui-input layui-disabled">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">课程名</label>
        <div class="layui-input-inline">
            <input id="coursename" readonly type="text" name="coursename" class="layui-input layui-disabled">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">课程号</label>
        <div class="layui-input-inline layui-disabled" >
            <input id="cid" readonly type="text" name="cid" class="layui-input layui-disabled">
        </div>
    </div>
    <hr class="layui-border-black">
    <div class="layui-card">
        <div class="layui-card-header">
            <i class="layui-icon layui-icon-edit" style="text-align: center;font-size: 20px; color: #009688;"></i>
            请键入需要的时间
        </div>

    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">开始时间</label>
        <div class="layui-input-inline">
            <input placeholder="请输入开始时间" id="starttime" type="text" name="starttime" autocomplete="off" class="layui-input">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">结束时间</label>
        <div class="layui-input-inline">
            <input placeholder="请输入结束时间" id="endtime" type="text" name="endtime" autocomplete="off" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label"><i class="layui-icon layui-icon-auz" style="text-align: center;font-size: 20px; color: #009688;"></i></label>
        <div class="layui-input-inline">
         <input lay-filter="ckbox" id="ckbox" type="checkbox" name="ckbox" title="已审核完毕，同意授权" lay-skin="primary">
        </div>
    </div>
</form>
<script src="../../layui/layui.js" charset="utf-8"></script>
<!-- 注意：如果你直接复制所有代码到本地，上述 JS 路径需要改成你本地的 -->

<script>

    layui.use(['table', 'form', 'laydate'], function(){

        var table = layui.table,
            form = layui.form,
            $ = layui.jquery,
            laydate = layui.laydate;

        //时间选择器
        laydate.render({
            elem: '#starttime' //指定元素
            ,type: 'datetime'
        });
        laydate.render({
            elem: '#endtime' //指定元素
            ,type: 'datetime'
        });
        table.on('tool(checktable)', function (obj){
            var Tdata = obj.data,

                layEvent = obj.event;
            console.log("原来表中的数据", Tdata);
            console.log(layEvent)

            /**
             * 修改操作
             */
            if(layEvent === "auz") {
                $.ajax({
                    type: "POST",
                    dataType: "json",
                    url: "/checkFindById",
                    data: obj.data,
                    success: function (res) {
                        console.log(res);
                        Rdata = res.data;
                        layer.open({
                            type: 1
                            ,skin: 'layui-layer-molv'
                            ,area: ['500px', '700px']
                            ,title: ['授权确认','font-size:18px']
                            ,btn: ['确定', '取消']
                            ,shadeClose: true
                            ,shade: 0 //遮罩透明度
                            ,maxmin: true //允许全屏最小化
                            ,content:$("#window") //弹窗路径,
                            ,success:function(layero, index){
                                $('#checkid').val(Rdata.checkid);
                                $('#bookid').val(Rdata.bookid);
                                $('#price').val(Rdata.price);
                                $('#stage').val(Rdata.stage);
                                $('#bookname').val(Rdata.bookname);
                                $('#cid').val(Rdata.cid);
                                $('#coursename').val(Rdata.coursename);
                                form.val("showform", {
                                    "ckbox": false
                                });

                                form.render();
                            }
                            , yes:function(){
                                let tabledata = form.val("showform");
                                tabledata.id = Rdata.id;

                                var arr_box = [];
                                $('input[type=checkbox]:checked').each(function() {
                                    arr_box.push($(this).val());
                                });
                                console.log($('#starttime').val())
                                console.log($('#endtime').val())
                                if(arr_box[0] == null) {
                                    layer.alert('请在审核完毕框打钩确认', {
                                        icon: 5,
                                        title: "提示"
                                    });
                                } else if($('#starttime').val() == null || $('#endtime').val() == null){
                                    layer.alert('请在开始和结束时间中填上值', {
                                        icon: 5,
                                        title: "提示"
                                    });
                                } else{


                                    $.ajax({
                                        type: "POST",
                                        dataType: "json",
                                        url: "/checkForward",
                                        data: tabledata,
                                        success: function (res) {
                                            layer.msg('成功了！');
                                            console.log(res);
                                            tabledata.stage = "3";
                                            console.log("这是确认修改后的操作", tabledata)
                                            $.ajax({
                                                type: "POST",
                                                dataType: "json",
                                                url: "/checkUpdateById",
                                                data: tabledata,
                                                success: function (res) {
                                                    console.log(res);
                                                    table.reload('checktable');
                                                },
                                                error: function (res){
                                                    console.log(res);
                                                }
                                            });
                                        },
                                        error: function (res){
                                            layer.msg('失败了！');
                                            console.log(res);
                                        }
                                    });
                                    layer.close(layer.index);
                                }

                            }

                        })
                    },
                    error: function (res){
                        console.log(res);
                    }
                });
            }

        })

        /**
         * table显示
         */
        table.render({
            elem: '#checktable'
            ,url: '/checkFind'
            ,toolbar: '#toolbarDemo'
            ,title: '用户数据表'
            ,totalRow: true
            ,cols: [[
                {type: 'checkbox', fixed: 'left'}
                ,{field:'id', title:'ID', width:50, fixed: 'left'}
                ,{field:'checkid', title:'审核编号', width:120, edit: 'text'}
                ,{field:'bookname', title:'教材名', width:120, edit: 'text'}
                ,{field:'bookid', title:'教材编号', width:100, edit: 'text'}
                ,{field:'price', title:'价格', width:100, edit: 'text'}
                ,{field:'coursename', title:'课程名', width:120, edit: 'text'}
                ,{field:'cid', title:'课程编号', width:100, edit: 'text'}
                ,{field:'stage', title:'阶段', width:260, edit: 'text'}
                ,{field:'starttime', title:'开始时间', width:180, edit: 'text'}
                ,{field:'endtime', title:'结束时间', width:180, edit: 'text'}
                ,{fixed: 'right', title:'操作', toolbar: '#barDemo', width:150}
            ]]
            ,page: true
            ,done: function(res, page, count) {
                //如果是异步请求数据方式，res即为你接口返回的信息。
                //如果是直接赋值的方式，res即为：{data: [], count: 99} data为当前页数据、count为数据总长度
                //     <option value="">请选择一个课程</option>
                //     <option value="0">未上传或已被删除</option>
                //     <option value="1">教师已上传，书商未审核</option>
                //     <option value="2">书商已经审核，管理员未审核</option>
                //     <option value="3">管理员审核，开放教材预定</option>
                //     <option value="4">预定完毕，待发放</option>
                //     <option value="5">发放完毕</option>
                //分类显示中文名称
                $("[data-field='stage']").children().each(function () {
                    if ($(this).text() == '0') {
                        $(this).text("未上传或已被删除")
                    } else if ($(this).text() == '1') {
                        $(this).text("第1阶段：教师已上传，书商未审核")
                    } else if ($(this).text() == '2') {
                        $(this).text("第2阶段：书商已经审核，管理员未审核")
                    } else if ($(this).text() == '3') {
                        $(this).text("第3阶段：管理员审核，开放教材预定")
                    }else if ($(this).text() == '4') {
                        $(this).text("第4阶段：预定完毕，待发放")
                    }else if ($(this).text() == '5') {
                        $(this).text("第5阶段：发放完毕")
                    }
                });
            }
        });


    });
</script>



</body>

</html>

